import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
    //要设置的全局访问的state对象
    state: {
        routerArr: localStorage.getItem('dataRouter') ? JSON.parse(localStorage.getItem('dataRouter')) : [], // 已打开的路由数据
        userData: sessionStorage.getItem('userData') ? JSON.parse(sessionStorage.getItem('userData')) : {}, // 用户信息数据
        isLogin: sessionStorage.getItem('userData') ? true : false, // 是否登陆
    },
    //实时监听state值的变化(最新状态)
    getters: {
        getRouterArr(state) {  //路由数据
            return state.routerArr
        },
        getUserData(state) {  //userData 用户数据
            return state.userData
        },
        getIsLogin(state) {  //user 登陆状态
            return state.isLogin
        }
    },
    // 自定义改变state初始值的方法，这里面的参数除了state之外还可以再传额外的参数(变量或对象);
    mutations: {
        pushRouterArr(state, data) { // 增加路由
            state.routerArr.push(data)
        },
        delRouterArr(state, index) { // 删除路由
            state.routerArr.splice(index, 1)
        },
        setUserData(state, data) { // 设置用户数据
            state.userData = data
        },
        setIsLogin(state, data) { // 修改登陆状态
            state.isLogin = data
        }
    },
    // 用来异步触发mutations里函数的方法，context与store 实例具有相同方法和属性
    actions: {
        pushRouter(context, data) { // 增加路由
            context.commit('pushRouterArr', data);
        },
        delRouter(context, index) { // 删除路由
            context.commit('delRouterArr', index);
        },
        setUserData(context, data) { // 设置用户数据
            context.commit('setUserData', data);
        },
        setIsLogin(context, data) { // 修改登陆状态
            context.commit('setIsLogin', data);
        }
    }
})
